<template>
  <div>
    <div class="reportBox tborder">
      <el-form :model="dataForm" size="mini" inline ref="dataForm" :rules="dataRule">
        <div class="boxRow">
          <div class="rowItem br">
            <el-form-item label="交接开始时间：" prop="BEGINNING_OF_HANDOVER">
              <el-date-picker
                style="width:100%"
                value-format="yyyy-MM-dd HH:mm"
                format="yyyy-MM-dd HH:mm"
                v-model="dataForm.BEGINNING_OF_HANDOVER"
                type="datetime"
                placeholder="选择日期时间"
              ></el-date-picker>
            </el-form-item>
          </div>
          <div class="rowItem br">
            <el-form-item label="交接结束时间：" prop="END_OF_HANDOVER">
              <el-date-picker
                style="width:100%"
                value-format="yyyy-MM-dd HH:mm"
                format="yyyy-MM-dd HH:mm"
                v-model="dataForm.END_OF_HANDOVER"
                type="datetime"
                placeholder="选择日期时间"
              ></el-date-picker>
            </el-form-item>
          </div>
          <div class="rowItem br">
            <el-form-item label="理货开始时间：" prop="CARGO_HANDING_BEG_TIME">
              <el-date-picker
                style="width:100%"
                value-format="yyyy-MM-dd HH:mm"
                format="yyyy-MM-dd HH:mm"
                v-model="dataForm.CARGO_HANDING_BEG_TIME"
                type="datetime"
                placeholder="选择日期时间"
              ></el-date-picker>
            </el-form-item>
          </div>
          <div class="rowItem br">
            <el-form-item label="理货结束时间：">
              <el-date-picker
                style="width:100%"
                value-format="yyyy-MM-dd HH:mm"
                format="yyyy-MM-dd HH:mm"
                v-model="dataForm.CARGO_HANDING_END_TIME"
                type="datetime"
                placeholder="选择日期时间"
              ></el-date-picker>
            </el-form-item>
          </div>
        </div>
        <div class="boxRow">
          <div class="rowItem br">
            <el-form-item label="舱单上运单总数：">
              <el-input v-model="dataForm.WAREHOUSE_TOTAL" placeholder>
                <template slot="append">票</template>
              </el-input>
            </el-form-item>
          </div>
          <div class="rowItem br">
            <el-form-item label="实际收到货单数：" prop="WAREHOUSE_ACTUAL_TOTAL">
              <el-input v-model="dataForm.WAREHOUSE_ACTUAL_TOTAL" placeholder>
                <template slot="append">票</template>
              </el-input>
            </el-form-item>
          </div>
          <div class="rowItem br">
            <el-form-item label="邮件件数：">
              <el-input v-model="dataForm.AIRMAILAMOUNT_IN_KILO" placeholder>
                <template slot="append">件</template>
              </el-input>
            </el-form-item>
          </div>
          <div class="rowItem">
            <el-form-item label="邮件重量：">
              <el-input v-model="dataForm.AIRMAILWEIGHT_IN_KILO" placeholder>
                <template slot="append">KG</template>
              </el-input>
            </el-form-item>
          </div>
        </div>

        <div class="rowItem boxRow">
          <el-form-item label="通知集控时间：">
            <el-date-picker
              style="width:100%"
              value-format="yyyy-MM-dd HH:mm"
              format="yyyy-MM-dd HH:mm"
              v-model="dataForm.NOTIFY_CONTORL_TIME"
              type="datetime"
              placeholder="选择日期时间"
            ></el-date-picker>
          </el-form-item>
        </div>
        <div class="boxRow boxtitle">航班交接集装设备总数（total ULD receved from Plamp Agent）:</div>
        <div class="boxRow pr20">
          <div class="rowItem">
            <span>HD：</span>
            <el-form-item prop="TOTAL_ULD_RHD">
              <el-input v-model="dataForm.TOTAL_ULD_RHD" placeholder></el-input>
            </el-form-item>
          </div>
          <div class="rowItem">
            <span>MD：</span>
            <el-form-item prop="TOTAL_ULD_RMD">
              <el-input v-model="dataForm.TOTAL_ULD_RMD" placeholder></el-input>
            </el-form-item>
          </div>
          <div class="rowItem">
            <span>LD：</span>
            <el-form-item prop="TOTAL_ULD_RLD">
              <el-input v-model="dataForm.TOTAL_ULD_RLD" placeholder></el-input>
            </el-form-item>
          </div>
          <div class="rowItem">
            <span>LD3：</span>
            <el-form-item prop="TOTAL_ULD_RLD3">
              <el-input v-model="dataForm.TOTAL_ULD_RLD3" placeholder></el-input>
            </el-form-item>
          </div>
        </div>
        <div class="boxRow">
          <div class="rowItem">
            <el-form-item label="散装货物总数 :" prop="BULKLOUDCARGO_IN_KILO">
              <el-input v-model="dataForm.BULKLOUDCARGO_IN_KILO" placeholder>
                <template slot="append">KG</template>
              </el-input>
            </el-form-item>
          </div>
        </div>

        <div class="boxRow">
          <div class="rowItem">
            <el-form-item label="进港板箱与FFM核对情况：" prop="INCOMEING_CONTAINER_COUNT">
              <el-input
                style="width:200px"
                v-model="dataForm.INCOMEING_CONTAINER_COUNT"
                placeholder
              >
                <template slot="append">板</template>
              </el-input>
            </el-form-item>
          </div>
          <div class="rowItem">
            <el-form-item label="与FFM一致：" prop="INCOMEING_CONTAINER_FFM_CHECK">
              <el-radio-group v-model="dataForm.INCOMEING_CONTAINER_FFM_CHECK">
                <el-radio label="是">是</el-radio>
                <el-radio label="否">否</el-radio>
              </el-radio-group>
            </el-form-item>
          </div>
        </div>

        <div class="boxRow" v-if="dataForm.INCOMEING_CONTAINER_FFM_CHECK=='否'">
          <div class="rowItem">
            <el-form-item label="是否已经通知航空公司：" prop="NOTIFY_AIR_CHECK">
              <el-radio-group v-model="dataForm.NOTIFY_AIR_CHECK">
                <el-radio label="是">是</el-radio>
                <el-radio label="否">否</el-radio>
              </el-radio-group>
            </el-form-item>
          </div>
        </div>

        <div class="boxRow">
          <div class="rowItem">
            <el-form-item label-width="210px" label="进港板箱与理货清单核对情况："></el-form-item>
            <el-form-item
              label-width="268px"
              label="HERMES中板箱是否都已经进行理货："
              prop="INCOMEING_CONTAINER_HERM_CHECK"
            >
              <el-radio-group v-model="dataForm.INCOMEING_CONTAINER_HERM_CHECK">
                <el-radio label="是">是</el-radio>
                <el-radio label="否">否</el-radio>
              </el-radio-group>
            </el-form-item>
          </div>
        </div>

        <div class="boxRow">
          <div class="rowItem">
            <el-form-item label="DMG ULD" prop="DMG">
              <el-input v-model="dataForm.DMG" placeholder></el-input>
            </el-form-item>
          </div>
        </div>
        <div class="boxRow">
          <div class="rowItem">
            <el-form-item label="空侧接待VCT" prop="VCT_PRINT">
              <el-checkbox v-model="dataForm.VCT_PRINT">已打印</el-checkbox>
            </el-form-item>
          </div>
          <div class="rowItem">
            <el-form-item label-width="125px" label="打印时间">
              <el-input v-model="dataForm.VCT_PRINT_TIME" placeholder></el-input>
            </el-form-item>
          </div>
        </div>
        <div class="boxRow boxtitle">其他信息</div>

        <div class="boxRow">
          <div class="rowItem">
            <el-form-item label="海关前置拦截采样：" prop="CUSTIMS_SAMPLE_COUNT">
              <el-input style="width:200px" v-model="dataForm.CUSTIMS_SAMPLE_COUNT" placeholder></el-input>
            </el-form-item>
          </div>
          <div class="rowItem">
            <el-form-item label="是否已登记：" prop="CUSTIMS_SAMPLE_CHECK">
              <el-radio-group v-model="dataForm.CUSTIMS_SAMPLE_CHECK">
                <el-radio label="是"></el-radio>
                <el-radio label="否"></el-radio>
                <el-radio label="N/A"></el-radio>
              </el-radio-group>
            </el-form-item>
          </div>
        </div>
        <div class="boxRow">
          <div style="display:flex;padding-left:20px;align-items: center;">
            <el-form-item label="进港航班不正常情况报告："></el-form-item>
          </div>

          <div class="rowItem">
            <el-input
              type="textarea"
              :autosize="{ minRows: 2, maxRows:10}"
              placeholder="请输入内容"
              v-model="dataForm.ABNORMAL_MEMO"
            ></el-input>
          </div>
        </div>
        <div style="text-align:right;padding:10px 20px" v-if="formId">
          <!-- <el-button type="primary">修改</el-button> -->
          <el-button v-if="isAuthBtn('extra1')" size="mini" type="success" @click="dataFormSubmit()">保存</el-button>
        </div>
      </el-form>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    formId: {
      default: 0
    }
  },
  data() {
    return {
      dataForm: {},
      dataRule: {
        BEGINNING_OF_HANDOVER: [
          { required: true, message: "交接开始时间不能为空", trigger: "blur" }
        ],
        END_OF_HANDOVER: [
          { required: true, message: "交接结束时间不能为空", trigger: "blur" }
        ],
        CARGO_HANDING_BEG_TIME: [
          { required: true, message: "理货开始时间不能为空", trigger: "blur" }
        ],
        WAREHOUSE_ACTUAL_TOTAL: [
          { required: true, message: "实际收到货单数不能为空", trigger: "blur" }
        ],
        CUSTIMS_SAMPLE_CHECK: [
          { required: true, message: "是否已登记不能为空", trigger: "blur" }
        ],
        CUSTIMS_SAMPLE_COUNT: [
          { required: true, message: "票数不能为空", trigger: "blur" }
        ],
        TOTAL_ULD_RHD: [
          { required: true, message: "HD不能为空", trigger: "blur" }
        ],
        TOTAL_ULD_RMD: [
          { required: true, message: "MD不能为空", trigger: "blur" }
        ],
        TOTAL_ULD_RLD: [
          { required: true, message: "LD不能为空", trigger: "blur" }
        ],
        TOTAL_ULD_RLD3: [
          { required: true, message: "LD3不能为空", trigger: "blur" }
        ],
        BULKLOUDCARGO_IN_KILO: [
          { required: true, message: "散装货物总数不能为空", trigger: "blur" }
        ],
        INCOMEING_CONTAINER_COUNT: [
          {
            required: true,
            message: "进港板箱与FFM核对情况不能为空",
            trigger: "blur"
          }
        ],
        INCOMEING_CONTAINER_FFM_CHECK: [
          { required: true, message: "与FFM一致不能为空", trigger: "blur" }
        ],
        NOTIFY_AIR_CHECK: [
          {
            required: true,
            message: "是否已经通知航空公司不能为空",
            trigger: "blur"
          }
        ],
        INCOMEING_CONTAINER_HERM_CHECK: [
          {
            required: true,
            message: "进港板箱与理货清单核对情况不能为空",
            trigger: "blur"
          }
        ],
        DMG: [{ required: true, message: "DMG ULD不能为空", trigger: "blur" }],
        VCT_PRINT: [
          { required: true, message: "空侧接待VCT不能为空", trigger: "blur" }
        ]
      }
    };
  },
  methods: {
    init(data) {
      this.dataForm = Object.assign({}, this.dataForm, data);
    },
    dataFormSubmit() {
      let dataForm = this.dataForm;
      let that = this;
      this.$refs["dataForm"].validate(valid => {
        console.log(this.dataForm.NOTIFY_CONTORL_TIME);
        console.log(this.dataForm.AIRMAILAMOUNT_IN_KILO);
        console.log(this.dataForm.WAREHOUSE_TOTAL);
        if (valid) {
          console.log(!dataForm.NOTIFY_CONTORL_TIME);
          if (
            !dataForm.NOTIFY_CONTORL_TIME ||
            !dataForm.AIRMAILAMOUNT_IN_KILO ||
            !dataForm.WAREHOUSE_TOTAL ||
            !dataForm.ABNORMAL_MEMO
          ) {
            let info = "";
            if (!dataForm.NOTIFY_CONTORL_TIME) {
              info += "未输入通知集控时间/";
            }
            if (!dataForm.AIRMAILAMOUNT_IN_KILO) {
              info += "未输入邮件件数/";
            }
            if (!dataForm.WAREHOUSE_TOTAL) {
              info += "未输入邮件重量/";
            }
            if (!dataForm.ABNORMAL_MEMO) {
              info += "进港航班不正常情况报告/";
            }
            that
              .$confirm(info + ", 是否继续?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
              })
              .then(() => {
                this.updateSumit();
              });
          } else {
            this.updateSumit();
          }
        }
      });
    },
    updateSumit() {
      let that = this;
      that
        .$http({
          url: that.$http.adornUrl(`/air/airReport_operatingRecode_save`),
          method: "post",
          data: that.$http.adornData(that.dataForm)
        })
        .then(({ data }) => {
          if (data.result == "1") {
            that.$message({
              message: "操作成功",
              type: "success",
              duration: 1500,
              onClose: () => {
                that.$emit("refsherData", sessionStorage.reportid);
              }
            });
          } else {
            that.$message.error(data.message);
          }
        });
    }
  }
};
</script>

<style lang="scss">
.reportBox {
  border: 2px solid #eee;
  width: 900px;
  margin: 10px;
  .el-form-item {
    margin: 0;
  }
}
.boxRow {
  display: flex;
  border-bottom: 1px solid #e6e6e6;
}
.br {
  border-right: 1px solid #e6e6e6;
}
.boxtitle {
  padding: 20px;
}
.rowItem {
  flex: 1;
  padding-left: 15px;
  padding-right: 15px;
  display: flex;
  align-items: center;
}
.pr20 .rowItem {
  padding-right: 20px;
}
.table--border {
  border-collapse: collapse;
  margin-top: 10px;
}
.table--border th {
  padding: 10px;
}
.tborder {
  td,
  th {
    border: 1px solid #e6e6e6;
    padding-left: 10px;
  }
}
</style>